<%--
  Created by IntelliJ IDEA.
  User: www10
  Date: 2022/4/16
  Time: 15:38
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>layerTable</title>
</head>
    <script src="${pageContext.request.contextPath}/resource/js/jquery-3.6.0/jquery-3.6.0.js"></script>
    <link rel="stylesheet" type="text/css" href="https://www.layuicdn.com/layui/css/layui.css" />
    <script src="https://www.layuicdn.com/layui/layui.js"></script>
<body>
            <h3>WHAT FUCK</h3>




    <button class="layui-btn" lay-submit   lay-filter="test" >立即提交</button>

            <button type="button" class="layui-btn" id="test1">
                <i class="layui-icon">&#xe67c;</i>上传图片
            </button>
    <hr>
    <table id="demo" lay-filter="test"></table>


    <hr>

            <p title="你最喜欢的水果是。">你最喜欢的水果是？</p>
            <ul>
                <li title="苹果汁">苹果</li>
                <li title="橘子汁" value="123">橘子</li>
                <li title="菠萝汁">菠萝</li>
            </ul>
            <button id="bb">点击按钮看attr()方法的效果</button>
            <h3></h3>

</body>
    <script type="text/javascript"></script>
    <script>

        layui.use(['form', 'upload','table','slider'], function(){  //如果只加载一个模块，可以不填数组。如：layui.use('form')
            var form = layui.form
            var upload=layui.upload;
            var table = layui.table;
            var $=layui.$

            $(document).ready(function(){
                $("#bb").click(function(){
                    var vatext= $("ul li:eq(1)").attr("value");
                    console.log()
                    // $("h3").text(vatext);
                });
            });

            form.on('submit(test)',function () {
                console.log(em)
            })


                form.on('switch(state)', function (data) {
                    console.log("data",data)
                    console.log(data.elem.attributes['menuId'].nodeValue);
                    console.log(data.elem.checked); // 开关是否开启，true或者false
                    console.log(data.value);        // 开关value值，也可以通过data.elem.value得到

                    // let menuId = data.elem.attributes['menuId'].nodeValue;
                    //console.log(data.elem);         // 得到checkbox原始DOM对象
                    //console.log(data.othis);        // 得到美化后的DOM对象
                });


            table.render({
                elem: '#demo'
                ,height: 312
                ,url: '/es/list3' //数据接口
                ,method:"post"
                ,page: true //开启分页
                ,parseData:function(res){
                    return{
                        "code":res.result,
                        "msg": res.msg, //解析提示文本
                        "count": res.obj.totalRow, //解析数据长度
                        "data": res.obj.datas //解析数据列表
                    }
                }
                ,cols: [[ //表头
                    {field: 'id', title: 'ID', width:80, sort: true, fixed: 'left'},
                    {field: 'title', title: '题目', width:400},
                    {field: 'siteName', title: '站定名称', width:300},
                    // {field: 'oldEntityId', title: '站定名称', width:300},
                    {field: 'siteid', title: '站点id', width:300},
                    {field: 'smallType', title: '名称状态', width:300},
                    {
                        field: 'status', title: '状态', width: 300,
                        templet: function (res) {
                            let menuId = res.id;
                            if (res.status == 150) {
                                return "   <input type='checkbox'  menuId = '" + menuId + "' lay-filter='state' lay-skin='switch' lay-text='ON|OFF' checked>"
                            } else if (res.status == 250) {
                                return "   <input type='checkbox'  menuId = '" + menuId + "'  lay-filter='state' lay-skin='switch' lay-text='ON|OFF'>"
                            }
                        }
                    },

                ]],
                response: {
                    statusCode: 200//规定成功的状态码，默认：0
                },

                done:function (res,curr,count) {
                    console.log(res)
                }
            });

            //监听提交按钮
            form.on('submit(test)', function(data){
                console.log(data);
                console.log("123")
            });

            //实例化一个上传控件
            upload.render({
                elem:'#test1',
                url:'/ftp/upload',
                async:false,
                before:function(){
                    loading  = layer.msg('正在上传', {icon:16, shade:0.3, time:0});
                },
                done:function (res, index, upload) {
                    layer.close(loading)
                    console.log(res)
                }
            })
        });
    </script>
</html>
